<%@ page language="java" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>


<div class="navbar navbar-default navbar-fixed-top" role="navigation">
    <!-- <div class="container"> -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="rhslogo" href="${ctx}"></a>
        </div>

        <!-- 动态菜单 -->
        <div class="navbar-collapse collapse">
            <ul id="navMenuRoot" class="nav navbar-nav">
                <!-- <li class="active"><a href="#">Home</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Action</a></li>
                        <li><a href="#">Another action</a></li>
                        <li><a href="#">Something else here</a></li>
                        <li class="divider"></li>
                        <li class="dropdown-header">Nav header</li>
                        <li><a href="#">Separated link</a></li>
                        <li><a href="#">One more separated link</a></li>
                    </ul>
                </li>  -->
            </ul>
            <ul class="nav navbar-nav navbar-right f-pr20">
            		<li class="green" id="yesRead">
						
					</li>
					            	
		         	<li class="green" id="noRead">
						
					</li>
	               <li class="dropdown">
	                   <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <i class="icon-user"></i>   <shiro:principal property="empName"/></a>
	                   <ul class="dropdown-menu">
	                       <li><a href="${ctx}/personInfo.jsp">个人信息</a></li>
	                       <li><a href="${ctx}/updatePassword.jsp">修改密码</a></li>
	                       <li><a href="${ctx}/logout">退出登陆</a></li>
	                   </ul>
	               </li>
			</ul>
       	 </div>
        <!--/.nav-collapse -->
    <!-- </div> -->
</div>

<script type="text/javascript">
	$(document).ready(function(){
		noRead();
		//yesRead();
		//单个标题点击事件 显示
		$("#noRead").on("click","li:gt(0) a",function(){	
			window.location.href=ctx+'/messageInfo.jsp?uuid='+$(this).attr("key")+'&isRead='+$(this).attr("isRead");
			
		});
		
		/* $("#yesRead").on("click","li:gt(0) a",function(){	
			window.location.href=ctx+'/messageInfo.jsp?uuid='+$(this).attr("key")+'&isRead='+$(this).attr("isRead");
			
		}); */
		//查看跟多点击事件
	});
	//查询未读的模板
	function noRead(){
		Otod.ajax({
			url:ctx+'/sys/amcm/queryForlistNoRead.do',
			data:{isRead:"20000002"},
			type:'GET',
			successFn:function(data){
				selectNoRead(data);
			}
		});
	}
	//显示模板
	function selectNoRead(data){
		var showNoRead = $("#showRead").html();
		Mustache.parse(showNoRead);
		var rendered = Mustache.render(showNoRead,{
			 data:data,
			 formatDt:function(){
				 return function(text,render){
					 return DateUtil.dateFormat(+render(text));
					
				 };
			 },
			  readType:function(){
				 return "未读";
			}, 
			isReadRes:function(){
				return "20000002";
			}
		});
		$("#noRead").html(rendered);
	}
	/*
	//查询已读的模板
	function yesRead(){
		Otod.ajax({
			url:ctx+'/sys/amcm/queryForlistNoRead.do',
			data:{isRead:"20000001"},
			type:'GET',
			successFn:function(data){
				selectYesRead(data);
			}
		});
	}
	//显示模板
	 function selectYesRead(data){
		var showYesRead = $("#showRead").html();
		Mustache.parse(showYesRead);
		var rendered = Mustache.render(showYesRead,{
			 data:data,
			 formatDt:function(){
				 return function(text,render){
					 return DateUtil.dateFormat(+render(text));
					
				 };
			 },
			readType:function(){
					 return "已读";
			},
			isReadRes:function(){
				return "20000001";
			}
		});
		$("#yesRead").html(rendered);
	} */
</script>

<script type="x-tmpl-mustache" id="showRead">
	{{#data}}
			<a data-toggle="dropdown" class="dropdown-toggle info" href="#">
				<i class="icon-envelope icon-animated-vertical"></i> {{readType}}
				<span class="badge badge-success">{{messageNumber}}</span>
			</a>
			<ul class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
				<li class="dropdown-header">
					<i class="icon-envelope-alt"></i>
					{{messageNumber}}条消息
				</li>
				
				{{#msgAppVos}}
					<li>
						<a href="#" key="{{uuid}}" isRead="{{isReadRes}}">
								<span class="msg-body">
									<span class="msg-title">
										<span class="blue">标题:</span>
										{{msgTitle}}
									</span>
									<span class="msg-time">
										<i class="icon-time"></i>
										<span>{{#formatDt}}{{msgCrateDt}}{{/formatDt}}</span>
									</span>
								</span>
						</a>
					</li> 
				{{/msgAppVos}}
				{{#messageNumber}}		
					<li>
						<a href="#" key="" isRead="{{isReadRes}}">
								查看所有消息
								<i class="icon-arrow-right"></i>
						</a>
					</li>
				{{/messageNumber}}	
			</ul>
	{{/data}}						
</script>

<%--
<div class="navbar navbar-fixed-top" id="navbar">
    <script type="text/javascript">
        try{ace.settings.check('navbar' , 'fixed')}catch(e){}
    </script>

    <div class="navbar-container" id="navbar-container">
        <div class="navbar-header pull-left">
            <a href="#" class="navbar-brand green">
                <small>
                    <i class="icon-leaf"></i>
                    RHS
                </small>
            </a><!-- /.brand -->
        </div><!-- /.navbar-header -->
        <!-- 菜单start -->
        <div class="navbar-header navbar-collapse collapse">
              <ul class="nav navbar-nav">
                      <li class="active"><a href="#">Home</a></li>
                    <li><a href="#about">About</a></li>
                    <li><a href="#contact">Contact</a></li>
                    <li class="dropdown">
                          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something else here</a></li>
                            <li class="divider"></li>
                            <li class="dropdown-header">Nav header</li>
                            <li><a href="#">Separated link</a></li>
                            <li><a href="#">One more separated link</a></li>
                        </ul>
                    </li>
              </ul>
        </div><!-- 菜单end -->
        <div class="navbar-header pull-right" role="navigation">
            <ul class="nav ace-nav">
                <li class="white">
                    <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                        <i class="icon-tasks"></i>
                        <span class="badge badge-grey">4</span>
                    </a>

                    <ul class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
                        <li class="dropdown-header">
                            <i class="icon-ok"></i>
                            还有4个任务完成
                        </li>

                        <li>
                            <a href="#">
                                <div class="clearfix">
                                    <span class="pull-left">软件更新</span>
                                    <span class="pull-right">65%</span>
                                </div>

                                <div class="progress progress-mini ">
                                    <div style="width:65%" class="progress-bar "></div>
                                </div>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <div class="clearfix">
                                    <span class="pull-left">硬件更新</span>
                                    <span class="pull-right">35%</span>
                                </div>

                                <div class="progress progress-mini ">
                                    <div style="width:35%" class="progress-bar progress-bar-danger"></div>
                                </div>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <div class="clearfix">
                                    <span class="pull-left">单元测试</span>
                                    <span class="pull-right">15%</span>
                                </div>

                                <div class="progress progress-mini ">
                                    <div style="width:15%" class="progress-bar progress-bar-warning"></div>
                                </div>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <div class="clearfix">
                                    <span class="pull-left">错误修复</span>
                                    <span class="pull-right">90%</span>
                                </div>

                                <div class="progress progress-mini progress-striped active">
                                    <div style="width:90%" class="progress-bar progress-bar-success"></div>
                                </div>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                查看任务详情
                                <i class="icon-arrow-right"></i>
                            </a>
                        </li>
                    </ul>
                </li>

                <li class="white">
                    <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                        <i class="icon-bell-alt icon-animated-bell"></i>
                        <span class="badge badge-important">8</span>
                    </a>

                    <ul class="pull-right dropdown-navbar navbar-pink dropdown-menu dropdown-caret dropdown-close">
                        <li class="dropdown-header">
                            <i class="icon-warning-sign"></i>
                            8条通知
                        </li>

                        <li>
                            <a href="#">
                                <div class="clearfix">
                                    <span class="pull-left">
                                        <i class="btn btn-xs no-hover btn-pink icon-comment"></i>
                                        新闻评论
                                    </span>
                                    <span class="pull-right badge badge-info">+12</span>
                                </div>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <i class="btn btn-xs btn-primary icon-user"></i>
                                切换为编辑登录..
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <div class="clearfix">
                                    <span class="pull-left">
                                        <i class="btn btn-xs no-hover btn-success icon-shopping-cart"></i>
                                        新订单
                                    </span>
                                    <span class="pull-right badge badge-success">+8</span>
                                </div>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <div class="clearfix">
                                    <span class="pull-left">
                                        <i class="btn btn-xs no-hover btn-info icon-twitter"></i>
                                        粉丝
                                    </span>
                                    <span class="pull-right badge badge-info">+11</span>
                                </div>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                查看所有通知
                                <i class="icon-arrow-right"></i>
                            </a>
                        </li>
                    </ul>
                </li>

                <li class="white">
                    <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                        <i class="icon-envelope icon-animated-vertical"></i>
                        <span class="badge badge-success">5</span>
                    </a>

                    <ul class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
                        <li class="dropdown-header">
                            <i class="icon-envelope-alt"></i>
                            5条消息
                        </li>

                        <li>
                            <a href="#">
                                <img src="assets/avatars/avatar.png" class="msg-photo" alt="Alex's Avatar" />
                                <span class="msg-body">
                                    <span class="msg-title">
                                        <span class="blue">Alex:</span>
                                        不知道写啥 ...
                                    </span>

                                    <span class="msg-time">
                                        <i class="icon-time"></i>
                                        <span>1分钟以前</span>
                                    </span>
                                </span>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <img src="assets/avatars/avatar3.png" class="msg-photo" alt="Susan's Avatar" />
                                <span class="msg-body">
                                    <span class="msg-title">
                                        <span class="blue">Susan:</span>
                                        不知道翻译...
                                    </span>

                                    <span class="msg-time">
                                        <i class="icon-time"></i>
                                        <span>20分钟以前</span>
                                    </span>
                                </span>
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <img src="assets/avatars/avatar4.png" class="msg-photo" alt="Bob's Avatar" />
                                <span class="msg-body">
                                    <span class="msg-title">
                                        <span class="blue">Bob:</span>
                                        到底是不是英文 ...
                                    </span>

                                    <span class="msg-time">
                                        <i class="icon-time"></i>
                                        <span>下午3:15</span>
                                    </span>
                                </span>
                            </a>
                        </li>

                        <li>
                            <a href="inbox.html">
                                查看所有消息
                                <i class="icon-arrow-right"></i>
                            </a>
                        </li>
                    </ul>
                </li>

                <li class="white">
                    <a data-toggle="dropdown" href="#" class="dropdown-toggle">
                        <img class="nav-user-photo" src="assets/avatars/user.jpg" alt="Jason's Photo" />
                        <span class="user-info">
                            <small>欢迎光临,</small>
                            Jason
                        </span>

                        <i class="icon-caret-down"></i>
                    </a>

                    <ul class="user-menu pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
                        <li>
                            <a href="#">
                                <i class="icon-cog"></i>
                                设置
                            </a>
                        </li>

                        <li>
                            <a href="#">
                                <i class="icon-user"></i>
                                个人资料
                            </a>
                        </li>

                        <li class="divider"></li>

                        <li>
                            <a href="#">
                                <i class="icon-off"></i>
                                退出
                            </a>
                        </li>
                    </ul>
                </li>
            </ul><!-- /.ace-nav -->
        </div><!-- /.navbar-header -->
    </div><!-- /.container -->
</div>--%>